<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>卷组快照</title>
	<link rel="stylesheet" href="../../css/index.css" />
	<link rel="stylesheet" href="../../js/plugins/animateTip/default-style/css/content.css" />
</head>
<body>
<!--列表内容-->
<div class="volume-snap-page page-bg">
	<div class="search-panel b-r-0">
		<!--搜索区域内容-->
		<div class="search-box pos-re">
			<div class="search-show">
				<div class="input-box">
					<input class="import-box" type="text" placeholder="快照名称" />
				</div>
				<div class="input-box">
					<input class="import-box w-128 pr-30" type="text" placeholder="用户名" />
					<a class="search-down up"><i class="search-down-icon com_icon"></i></a>
				</div>
				<a class="search-btn search_icon"></a>
				<a class="search-back-btn search_icon"></a>
			</div>
		</div>

	</div>
	<!--列表-->
	<div class="table">
		<ul class="ul_head">
			<li style="width: 3%; border:none;">
			</li>
			<li style="width: 7%; border: none">用户名</li>
			<li style="width: 12%">所属服务器</li>
			<li style="width: 12%">快照名称</li>
			<li style="width: 11%">快照大小</li>
			<li style="width: 19%">创建时间</li>
			<li style="width: 8%">卷组名称</li>
			<li style="width: 10%">
				<div class="state-panel select_panel">
					<div class="select_normal">
						状态
						<a class="state-search search-down"><i class="search-down-icon com_icon"></i></a>
					</div>
					<ul class="state-select select_content">
						<li class="select_option active" sid="1">全部</li>
						<li class="select_option" sid="2">运行中</li>
						<li class="select_option" sid="3">已关机</li>
						<li class="select_option" sid="4">错误</li>
					</ul>
				</div>
			</li>
			<li style="width: 17%">操作</li>
		</ul>
		<ul class="ul_body">
			<li class="li_tr">
				<ul>
					<li class="ul_body_td" style="width: 3%; border:none;">
						<p class="td_content">
						</p>
					</li>
					<li class="ul_body_td" style="width:7%">
						<p class="td_content">
							troila
						</p>
					</li>
					<li class="ul_body_td" style="width: 12%">
						<p class="td_content">server10</p>
					</li>
					<li class="ul_body_td" style="width: 12%">
						<p class="td_content">研发专用</p>
					</li>
					<li class="ul_body_td" style="width: 11%">
						<p class="td_content">40GB</p>
					</li>
					<li class="ul_body_td" style="width: 19%">
						<p class="td_content">前端开发专用</p>
					</li>
					<li class="ul_body_td" style="width: 8%">
						<p class="td_content">前端开发专用</p>
					</li>
					<li class="ul_body_td" style="width: 10%">
						<p class="td_content"><span class="state-on state_sign">使用中</span></p>
					</li>
					<li class="ul_body_td" style="width: 17%">
						<div class="handle-select select_panel">
							<div class="select_normal">
								<a class="td_btn unc">删除</a>
								<span class="undel-icon" data-tip="使用中，不可删"></span>
							</div>
							<div class="more-handle">
								<a class="td_btn">分配IP</a>
								<a class="td_btn">释放IP</a>
							</div>
						</div>
					</li>
				</ul>
			</li>
			<li class="li_tr">
				<ul>
					<li class="ul_body_td" style="width: 3%; border:none;">
						<p class="td_content">
						</p>
					</li>
					<li class="ul_body_td" style="width:7%">
						<p class="td_content">
							troila
						</p>
					</li>
					<li class="ul_body_td" style="width: 12%">
						<p class="td_content">server10</p>
					</li>
					<li class="ul_body_td" style="width: 12%">
						<p class="td_content">研发专用</p>
					</li>
					<li class="ul_body_td" style="width: 11%">
						<p class="td_content">40GB</p>
					</li>
					<li class="ul_body_td" style="width: 19%">
						<p class="td_content">前端开发专用</p>
					</li>
					<li class="ul_body_td" style="width: 8%">
						<p class="td_content">前端开发专用</p>
					</li>
					<li class="ul_body_td" style="width: 10%">
						<p class="td_content"><span class="state-available state_sign">可用</span></p>
					</li>
					<li class="ul_body_td" style="width: 17%">
						<div class="handle-select select_panel">
							<div class="select_normal">
								<a class="td_btn">删除</a>
								<span class="undel-icon" data-tip="使用中，不可删"></span>
							</div>
							<div class="more-handle">
								<a class="td_btn">分配IP</a>
								<a class="td_btn">释放IP</a>
							</div>
						</div>
					</li>
				</ul>
			</li>
		</ul>
	</div>
	<!--底部分页-->
	<div class="table-footer">
		<!--设置每页显示条数-->
		<div class="change-record">
			<label class="foot-label">每页显示</label>
			<div class="record-select">
				<p class="now-record">10<i class="show-record-ul com_icon"></i></p>
				<ul class="record-ul">
					<li class="record-item">10</li>
					<li class="record-item">20</li>
				</ul>
				<span class="record-unit">条</span>
				<div class="checked-count">，选中<span id="checkedCount" class="count-num color0099ff">0</span>条</div>
			</div>
		</div>
	</div>
</div>
</body>
<script type="text/javascript" src="../../js/libs/jquery-1.11.1.min.js"></script>
<script src="../../js/libs/jquery-ui/jquery.ui.position.min.js" type="text/javascript"></script>
<script src="../../js/plugins/animateTip/default-style/js/jquery.animateTip.js" type="text/javascript"></script>
<script type="text/javascript" src="../../js/view/volumeManage/volumeSnapshot.js"></script>
</html>